<template>
  <div>
    <el-form ref="form" :rules="rules" :model="form" label-width="80px" label-position="left">
      <el-row :gutter="20">
        <el-col :span="16">
          <el-form-item label="项目名称" prop="xmId">
            <el-select v-model="form.xmId" class="filter-item" placeholder="项目" style="width: 100%" clearable>
              <el-option v-for="item in xmList" :key="item.id" :label="item.xiangmumingcheng" :value="item.id" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="公告类型" prop="type">
            <el-select v-model="form.type" clearable style="width:100%;">
              <el-option v-for="item in fenleiList" :key="item.code" :label="item.name" :value="item.code" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="16">
          <el-form-item label="公告标题" prop="title">
            <el-input v-model.trim="form.title" placeholder="请输入公告标题" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="发布日期" prop="fabuTime">
            <el-date-picker v-model="form.fabuTime" type="date" placeholder="选择日期" value-format="yyyy-MM-dd" style="width:100%;" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="16">
          <el-form-item label="来源URL">
            <el-input v-model.trim="form.source" placeholder="请输入来源URL" />
          </el-form-item>
        </el-col>
      </el-row>

      <el-form-item label="公告内容" prop="neiRong">
        <tinymce ref="tinymceRemark" v-model="form.neiRong" :height="250" />
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <div style="text-align:center;">
        <el-button type="primary" @click="onSave">保存</el-button>
        <el-button type="danger" class="quxiao_btn" @click="closePage()">取消</el-button>
      </div>
    </span>
  </div>
</template>

<script>
import { edit, getInfo } from '@/api/baseNotice'
import { getXiangMuList } from '@/api/projectInfo'
import { getDictListByCode } from '@/api/dict'

import { Message } from 'element-ui'

export default {
  name: 'FuncFormsEdit',
  inject: ['getList'],
  props: {
    proid: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      form: {
        id: '',
        title: '',
        type: '',
        neiRong: '',
        fabuTime: ''
      },
      code: '',
      fenleiList: [],
      xmList: [],
      rules: {
        xmId: [
          { required: true, message: '项目名称不能为空', trigger: 'change' }
        ],
        type: [
          { required: true, message: '公告类型不能为空', trigger: 'change' }
        ],
        title: [
          { required: true, message: '公告标题不能为空', trigger: 'change' }
        ],
        fabuTime: [
          { required: true, message: '发布日期不能为空', trigger: 'change' }
        ],
        neiRong: [
          { required: true, message: '内容不能为空', trigger: 'change' }
        ]
      }
    }
  },
  created() {
    this.getXiangMuList()
    this.getDictEntry('CDS_NOTICE_TYPE')
  },
  methods: {
    getDetailed() {
      const loading = this.$loading({
        lock: true,
        text: 'Loading',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      getInfo({ code: this.proid }).then(response => {
        this.form = response.data.notcie

        loading.close()
      }).catch(function() {
        loading.close()
      })
    },
    getXiangMuList() { // 加载列表
      this.xmList = []

      getXiangMuList().then(response => {
        this.xmList = response.data

        this.listLoading = false
      }).catch(response => {
        this.listLoading = false
      })
    },
    getDictEntry(code) {
      getDictListByCode(code).then(response => {
        if (code === 'CDS_NOTICE_TYPE') {
          this.fenleiList = response.data
        }
      })
    },
    async onSave() {
      this.$refs.form.validate(valid => {
        if (valid) {
          edit(this.form).then(response => {
            Message({
              message: '编辑成功',
              type: 'success',
              duration: 5 * 1000
            })
            this.$emit('update:visible', false)
            this.getList()
          })
        } else {
          return false
        }
      })
    },
    closePage() {
      this.$emit('update:visible', false)
    }
  }
}
</script>

